<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>活动</title>
		<meta name="Author" content="余光cc" /> 
        <meta name="Copyright" content="网站版权" /> 
        <meta name="keywords" content="网站关键字" />
        <meta name="description" content="网站描述" />
        <link rel="Shortcut Icon" href="网站.ico图标路径" />
		<link rel="stylesheet" type="text/css" href="css/reset.css"/>
		<link rel="stylesheet" type="text/css" href="css/activity.css"/>
		<link rel="stylesheet" type="text/css" href="layui/css/layui.css"/>
		<link rel="stylesheet" type="text/css" href="css/swiper-4.2.0.min.css"/>
	</head>
	<body>
	<div class="box" style="background: url(images/survey.png) no-repeat;">
		<div class="box-back">返回</div>
		<div class="box-top">
			<div class="box-top-left ">
				<div class="swiper-container">
				    <div class="swiper-wrapper">
				        
				    </div>
				    <!-- 如果需要分页器 -->
				    <div class="swiper-pagination"></div>
				    
				    <!-- 如果需要导航按钮 -->
				    <div class="swiper-button-prev"></div>
				    <div class="swiper-button-next"></div>
				</div>
			</div>
			
			
		</div>
		<div class="box-bottom">
			<div class="box-bottom-left " >
				<div class="box-b-cont"  id="l1">
					<ul id="LAY_demo1">
					
					</ul>
				</div>
			</div>
			<div class="box-bottom-right " >
				<div class="box-b-cont" id="l2" >
					<ul id="LAY_demo2">
					
					</ul>
				</div>
			</div>
		</div>
	</div>
	<script src="js/jquery-3.3.1-min.js" type="text/javascript" charset="utf-8"></script>
	<script src="layui/layui.all.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/echarts.common.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/swiper-4.2.0.min.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
		 
		$('.tk-link').on('click',function(){
			    
			var height = $(window).height();
			layer.open({
		      type: 2,
		      title: '新闻详情',
		      shadeClose: true,
		      shade: false,
		      maxmin: true, //开启最大化最小化按钮
		      area: ['1300px', height + 'px'],
		      content: 'news-tk.html'
		    });
		})
		$.ajax({
	      	type:"post",
	      	url:"http://www.shopyun.top:8011/dp/api/newsindex",
	      	async:true,
	      	success:function(data){
	      		console.log(data);
	      		var lunbo = '';
	      		var shyk = '';
	      		$.each(data.lunbo, function(i,v) {
	      			lunbo += '<div class="swiper-slide data-id="'+v.n_id+'">';
			        lunbo += 	'<img src="http://www.shopyun.top:8011'+v.URL+'"/>';
			        lunbo += '</div>';
	      		});
	      		
	      		$.each(data.shyk, function(i,v) {
	      			shyk += '<div class="box-top-right" data-id="'+v.n_id+'">';
					shyk +=	'<img src="http://www.shopyun.top:8011'+v.URL+'"/>';
					shyk +='</div>';
	      		});
	      		$('.swiper-wrapper').append(lunbo);
	      		$('.box-top').append(shyk);
	      		$('.swiper-slide').unbind().on('click',function(){
		        	var hegit = $(window).height();
		        	var id = $(this).attr('data-id');
		        	
		        	layer.open({
				      type: 2,
				      title: '新闻详情',
				      shadeClose: true,
				      shade: false,
				      maxmin: false, //开启最大化最小化按钮
				      area: ['1300px', hegit+'px'],
				      content: 'news-tk.html?id=' +id
				    });
		        })
	      		$('.box-top-right').unbind().on('click',function(){
		        	var hegit = $(window).height();
		        	var id = $(this).attr('data-id');
		        	layer.open({
				      type: 2,
				      title: '新闻详情',
				      shadeClose: true,
				      shade: false,
				      maxmin: false, //开启最大化最小化按钮
				      area: ['1300px', hegit+'px'],
				      content: 'news-tk.html?id=' +id
				    });
		        })
	      		var mySwiper = new Swiper ('.swiper-container', {
			    loop: true,
			    autoplay: true,
			    // 如果需要分页器
			    pagination: {
			      el: '.swiper-pagination',
			    },
			    
			    // 如果需要前进后退按钮
			    navigation: {
			      nextEl: '.swiper-button-next',
			      prevEl: '.swiper-button-prev',
			    },
			    
			    // 如果需要滚动条
			    scrollbar: {
			      el: '.swiper-scrollbar',
			    },
			  })   
	      	}
	      });
		layui.use('flow', function(){
		  var flow = layui.flow;
		 
		  flow.load({
		    elem: '#LAY_demo1' //流加载容器
		    ,scrollElem: '#l1' //滚动条所在元素，一般不用填，此处只是演示需要。
		    ,done: function(page, next){ //执行下一页的回调
		      $.ajax({
		      	type:"post",
		      	url:"/dp/api/newsList",
		      	data:{type:1,page:page},
		      	async:true,
		      	success:function(data){
		      		console.log(data);
		      		var lis = [];
		      		$.each(data.list, function(i,v) {
		      			console.log(i,v);
		      			var li = '';
		        	    li +=' <li>';
		        	    li +=' <div class="b-r-b-i-list" data-id="'+v.id+'">';
						li +=' <a href="javascript:;">';
//						li +=' <img src="images/map-tk-img.png" alt="" />';
						li +=' <img src="'+v.imgurl+'" alt="" />';
						li +=' <div class="list-text">';
						li +=' <p>'+v.title+'</p>';
						li +=' <time>'+v.creat_time+'</time>';
						li +=' </div>';
						li +=' </a>';
						li +=' </div>';
						li +=' </li>';
						lis.push(li);
		      		});
		      		setTimeout(function(){
			        //执行下一页渲染，第二参数为：满足“加载更多”的条件，即后面仍有分页
			        //pages为Ajax返回的总页数，只有当前页小于总页数的情况下，才会继续出现加载更多
			        next(lis.join(''), page < Math.ceil(data.records / 10)); //假设总页数为 10
			        $('#LAY_demo1 .b-r-b-i-list').unbind().on('click',function(){
			        	var hegit = $(window).height();
			        	var id = $(this).attr('data-id');
			        	layer.open({
					      type: 2,
					      title: '新闻详情',
					      shadeClose: true,
					      shade: false,
					      maxmin: false, //开启最大化最小化按钮
					      area: ['1300px', hegit+'px'],
					      content: 'news-tk.html?id=' +id
					    });
			        })
			      }, 500);
		      	}
		      });
		      //模拟数据插入
		      
		    }
		  });
		  
		});
		layui.use('flow', function(){
		  var flow = layui.flow;
		 
		  flow.load({
		    elem: '#LAY_demo2' //流加载容器
		    ,scrollElem: '#l2' //滚动条所在元素，一般不用填，此处只是演示需要。
		    ,done: function(page, next){ //执行下一页的回调
		      $.ajax({
		      	type:"post",
		      	url:"/dp/api/newsList",
		      	data:{type:2,page:page},
		      	async:true,
		      	success:function(data){
					console.log("itemitem")
		      		console.log(data);
		      		var lis = [];
		      		$.each(data.list, function(i,v) {
		      			console.log(i,v);
		      			var li = '';
		        	    li +=' <li>';
		        	    li +=' <div class="b-r-b-i-list" data-id="'+v.id+'">';
						li +=' <a href="javascript:;">';
//						li +=' <img src="images/map-tk-img.png" alt="" />';
						li +=' <img src="'+v.imgurl+'" alt="" />';
						li +=' <div class="list-text">';
						li +=' <p>'+v.title+'</p>';
						li +=' <time>'+v.creat_time+'</time>';
						li +=' </div>';
						li +=' </a>';
						li +=' </div>';
						li +=' </li>';
						lis.push(li);
		      		});
		      		setTimeout(function(){
			        //执行下一页渲染，第二参数为：满足“加载更多”的条件，即后面仍有分页
			        //pages为Ajax返回的总页数，只有当前页小于总页数的情况下，才会继续出现加载更多
			        next(lis.join(''), page < Math.ceil(data.records / 10)); //假设总页数为 10
			        $('#LAY_demo2 .b-r-b-i-list').unbind().on('click',function(){
			        	var hegit = $(window).height();
			        	var id = $(this).attr('data-id');
			        	layer.open({
					      type: 2,
					      title: '新闻详情',
					      shadeClose: true,
					      shade: false,
					      maxmin: false, //开启最大化最小化按钮
					      area: ['1300px', hegit+'px'],
					      content: 'news-tk.html?id=' + id
					    });
			        })
			      }, 500);
		      	}
		      });
		       
		    }
		  });
		  
		});
		$('.box-back').on('click',function(){
			window.history.go(-1);
		})
	</script>
	 
	</body>
</html>
